
<ion-navbar *navbar hideBackButton class="show-navbar">
  <ion-title>Map Card</ion-title>
</ion-navbar>

<ion-content class="has-header components-demo cards-bg">

<ion-card class="adv-map">
  <div style="position: relative">
    <img src="img/advance-card-map-madison.png">
    <button fab fab-right fab-top class="fab-map">
      <ion-icon name='pin'></ion-icon>
    </button>
  </div>
  <ion-item>
    <ion-icon subtle large item-left name='football'></ion-icon>
    <h2>Museum of Football</h2>
    <p>11 N. Way St, Madison, WI 53703</p>
  </ion-item>
  <ion-item>
    <ion-icon subtle large item-left name='wine'></ion-icon>
    <h2>Institute of Fine Cocktails</h2>
    <p>14 S. Hop Avenue, Madison, WI 53703</p>
  </ion-item>
  <ion-item actions>
    <span item-left secondary class="item-bold">18 min</span>
    <span item-left subtle>(2.6 mi)</span>
    <button primary clear item-right>
      <ion-icon name='navigate'></ion-icon>
      Start
    </button>
  </ion-item>

</ion-card>

<ion-card class="adv-map">
  <div style="position: relative">
    <img src="img/advance-card-map-mario.png">
    <button danger fab fab-right fab-top class="fab-map">
      <ion-icon name='pin'></ion-icon>
    </button>
  </div>
  <ion-item>
    <ion-icon subtle large item-left name='cloud'></ion-icon>
    <h2>Yoshi's Island</h2>
    <p>Iggy Koopa</p>
  </ion-item>
  <ion-item>
    <ion-icon subtle large item-left name='leaf'></ion-icon>
    <h2>Forest of Illusion</h2>
    <p>Roy Koopa</p>
  </ion-item>
  <ion-item actions>
    <span item-left class="item-bold">3 hr</span>
    <span item-left subtle>(4.8 mi)</span>
    <button danger clear item-right>
      <ion-icon name='navigate'></ion-icon>
      Start
    </button>
  </ion-item>

</ion-card>

<ion-card class="adv-map">
  <div style="position: relative">
    <img src="img/advance-card-map-paris.png">
    <button secondary fab fab-right fab-top class="fab-map">
      <ion-icon name='pin'></ion-icon>
    </button>
  </div>
  <ion-item>
    <ion-icon subtle large item-left name='information-circle'></ion-icon>
    <h2>Museum of Information</h2>
    <p>44 Rue de Info, 75010 Paris, France</p>
  </ion-item>
  <ion-item>
    <ion-icon subtle large item-left name='leaf'></ion-icon>
    <h2>General Pharmacy</h2>
    <p>1 Avenue Faux, 75010 Paris, France</p>
  </ion-item>
  <ion-item actions>
    <span item-left secondary class="item-bold">26 min</span>
    <span item-left subtle>(8.1 mi)</span>
    <button secondary clear item-right>
      <ion-icon name='navigate'></ion-icon>
      Start
    </button>
  </ion-item>

</ion-card>


</ion-content>
